<script>
import { isFunction } from "lodash";
import comMixin from "./comMixin.js";
export default {
  mixins: [comMixin],
  props: {
    onClick: {
      type: Function,
    },
    loading: {
      type: Boolean,
      default: false,
    },
    tip: {
      type: String,
    },
    perm: {
      type: String,
    },
    type: {
      type: String,
      default: "primary",
    },
    size: {
      type: String,
      default: "mini",
    },
    visiable:{
      type: Boolean,
      default: true
    }
  },
  computed: {
    permVisiable() {
      return this.perm ? this.$store.state[this.perm] : true;
    },
  },
  methods: {
    onBotton(e) {
      if (isFunction(this.onClick)) {
        this.onClick(e);
      } else {
        this.$emit("click", e);
      }
    },
    renderButton() {
      const jsxButton = (
        <el-button
          size={this.size}
          type={this.type}
          style={this.style}
          loading={this.loading}
          onClick={this.onBotton}
        >
          {this.label}
        </el-button>
      );
      return !this.tip ? (
        jsxButton
      ) : (
        <el-tooltip effect="dark" content={this.tip} placement="right-start">
          {jsxButton}
        </el-tooltip>
      );
    },
  },
  render() {
    return this.visiable && this.permVisiable ? this.renderButton() : null;
  },
};
</script>